<template>
  <div class="cost-summary">
    <ProTable
      ref="coupon_bill_table"
      :immediate="true"
      :search-form="formList"
      :columns="columns"
      :request="getCouponBillList"
      :pagination="true"
      :before-search-submit="beforeSearchSubmit"
    >
      <template #extra>
        <Authc permissions="trade:settlement:bill:CouponBill">
          <Button type="primary" @click="exportCouponBill">导出</Button>
        </Authc>
      </template>
    </ProTable>
  </div>
</template>

<script>
import {omit} from 'lodash';
import ProTable from '@/components/ProTable';
import {getDateRangeDate} from '@/utils/date'
import {
  getOrderDictionary, getMerchantAllMerchant, getMerchantAllOrg, getCouponBillList,
  generateSettleLetters,deleteBySettleLettersCode,exportCouponBillList
} from '@/api/statement';
import util from '@/utils/util'
import {Modal} from "view-design";
import appService from '@/utils//appService';
import Authc from "@/components/Authc";
export default {
  components: {
    // Button,
    Authc,
    ProTable
  },
  data() {
    return {
      formList: [
        {
          type: 'range',
          name: 'date',
          label: '使用时间',
          value: '',
          props: {
            placeholder: '请选择',
            format: 'yyyy年MM月dd日'
          }
        },
        {
          type: 'select',
          name: 'orderSource',
          label: '场景',
          value: '',
          props: {
            placeholder: '请选择',
            optionList: [],
            clearable: true
          }
        },
        {
          type: 'input',
          name: 'orderId',
          label: '主订单号',
          value: '',
          props: {
            placeholder: '请输入',
            clearable: true
          }
        },
        {
          type: 'input',
          name: 'transactionId',
          label: '渠道订单号',
          value: '',
          props: {
            placeholder: '请输入',
            clearable: true
          }
        },
        {
          type: 'input',
          name: 'couponBatchId',
          label: '券批次',
          value: '',
          props: {
            placeholder: '请输入',
            clearable: true
          }
        },
        {
          type: 'input',
          name: 'couponNo',
          label: '卡券号',
          value: '',
          props: {
            placeholder: '请输入',
            clearable: true
          }
        },
        {
          type: 'select',
          name: 'couponType',
          label: '券类型',
          value: '',
          props: {
            placeholder: '请选择',
            optionList: [
              {
          value: 1,
          label: "渠道券"
        },{
          value: 2,
          label: "平台券"
        }
            ],
            clearable: true
          }
        },
      ],
      columns: [
        {
          title: '序号',
          type: 'index',
          align: 'center',
          width:50
        },
        {
          title: '主订单号',
          key: 'orderId',
          align: 'center',
          width:150
        },
        {
          title: '主订单名称',
          key: 'orderName',
          align: 'center',
          width:200
        },
        {
          title: '支付流水号',
          key: 'payFlowId',
          align: 'center',
          width:150
        },
        {
          title: '主商户编号',
          key: 'merchantCode',
          align: 'center',
          width:150
        },
        {
          title: '主商户名称',
          key: 'merchantName',
          width:100,
          align: 'center'
        },
        {
          title: '支付渠道类型',
          key: 'payChannel',
          align: 'center',
          width:80
        },
        {
          title: '业务渠道',
          key: 'orderSourceCn',
          align: 'center',
          width:50
        },
        {
          title: '订单应收金额',
          key: 'orderAmount',
          width:80,
          align: 'center',
          render: (h, params) => {
            let item = params.row.orderAmount / 100;
            return h('span', util.toMoney(item))
          }
        },
        {
          title: '支付总金额',
          key: 'payAmount',
          align: 'center',
          width:80,
          render: (h, params) => {
            let item = params.row.payAmount / 100;
            return h('span', util.toMoney(item))
          }
        },
        {
          title: '优惠总金额',
          key: 'discount',
          align: 'center',
          width:80,
          render: (h, params) => {
            let item = params.row.discount / 100;
            return h('span', util.toMoney(item))
          }
        },
        {
          title: '平台优惠金额',
          key: 'platformDiscount',
          align: 'center',
          width:80,
          render: (h, params) => {
            let item = params.row.platformDiscount / 100;
            return h('span', util.toMoney(item))
          }
        },
        {
          title: '渠道优惠金额',
          key: 'channelDiscount',
          align: 'center',
          width:80,
          render: (h, params) => {
            let item = params.row.channelDiscount / 100;
            return h('span', util.toMoney(item))
          }
        },
        {
          title: '支付时间',
          key: 'payTime',
          align: 'center',
          width:150
        },
        {
          title: '渠道订单号',
          key: 'transactionId',
          align: 'center',
          width:180,
        },
        {
          title: '券批次',
          key: 'couponBatchId',
          align: 'center',
          width:100,
        },
        {
          title: '卡券号',
          key: 'couponNo',
          align: 'center',
          width:180
        },
        {
          title: '使用门槛',
          key: 'minimum',
          align: 'center',
          width:100
        },
        {
          title: '可用时间',
          align: 'center',
          width:180,
          render: (h, params) => {
            return h('div', params.row.availableStartTime ||'' + "至" + params.row.availableEndTime||'');
          }
        },
        {
          title: '优惠券类型',
          align: 'center',
          width:180,
          render: (h, params) => {
            return h('div', params.row.couponType ===1?'渠道券':'平台券');
          }
        }
      ]
    };
  },
  created() {
    this.initSearchValue()
  },
  methods: {
    getCouponBillList,
    /**
     * 删除对账函
     */
    async exportCouponBill() {
      let data=this.$refs['coupon_bill_table'].getSearchParams()
      const res=await exportCouponBillList(this.searchDateHandler(data))
      if (res) {
        util.exportExcle(res, '优惠券账单');
      }

    },
    beforeSearchSubmit(data) {
      return omit(data, this.searchDateHandler(data))
    },
    searchDateHandler(data) {
      const {date} = data

      const [startDate, endDate] = getDateRangeDate(date)
      console.log(startDate, endDate)
      if (startDate) {
        data.payTimeStart = util.formatDate(startDate)
      }
      if (endDate) {
        data.payTimeEnd = util.formatDate(endDate)
      }

      return data
    },
    async initSearchValue() {
      const orderSourceList = await getOrderDictionary("orderSource")
      const selectRevenueTypeList = orderSourceList.map(({value, key}) => {
        return {
          value: key,
          label: value
        };
      });
      this.setSearchOptionListInitValue("orderSource", selectRevenueTypeList)

      // 查询商户
      const merchantList = await getMerchantAllMerchant();
      const selectMerchantList = merchantList.map(({merchantCode, merchantName}) => {
        return {
          value: merchantCode,
          label: merchantName
        };
      });
      this.setSearchOptionListInitValue("merchantCode", selectMerchantList)
    },

    setSearchOptionListInitValue(name, value) {
      this.formList.map(item => {
        if (item.name === name && item.props) {
          item.props.optionList = value
        }
      })
    }
  }
};
</script>
